<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<style type="text/css">
			/*ilne-block 内如果没有文本，基线是margin下边界
			 
			 
			 
			 
			  */
			.baba{
				width: 700px;
				height: 400px;
				background: skyblue;
				font-size: 0;
				
			}
			
			.sou{
				
				width: 100px;
				height: 100px;
				background: red;
				/*margin: 30px;*/
				display: inline-block;
				vertical-align: top;
				
			}
			.sou:nth-child(2){
				
				vertical-align: middle;
			}
			.son:nth-child(3){
				
				height:  150px;
				
			}
		</style>
		
		
		
		
		<div class="baba">
			<div class="sou"></div>
			<div class="sou"></div>
			<div class="sou"></div>
			<div class="sou"></div>
		</div>
	</body>
</html>
